<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>scripts</title>
</head>
<body>
<div th:fragment="scripts">
    <!-- Plugin scripts -->
    <script th:src="@{/vendors/bundle.js}"></script>

    <!-- Chartjs -->
    <script th:src="@{/vendors/charts/chartjs/chart.min.js}"></script>

    <!-- Apex chart -->
    <script th:src="@{/vendors/charts/apex/apexcharts.min.js}"></script>

    <!-- Circle progress -->
    <script th:src="@{/vendors/circle-progress/circle-progress.min.js}"></script>

    <!-- Peity -->
    <script th:src="@{/vendors/charts/peity/jquery.peity.min.js}"></script>
    <script th:src="@{/assets/js/examples/charts/peity.js}"></script>

    <!-- Datepicker -->
    <script th:src="@{/vendors/datepicker/daterangepicker.js}"></script>

    <!-- Slick -->
    <script th:src="@{/vendors/slick/slick.min.js}"></script>

    <!-- Vamp -->
    <script th:src="@{/vendors/vmap/jquery.vmap.min.js}"></script>
    <script th:src="@{/vendors/vmap/maps/jquery.vmap.usa.js}"></script>
    <script th:src="@{/assets/js/examples/vmap.js}"></script>

    <!-- Dashboard scripts -->
    <script th:src="@{/assets/js/examples/dashboard.js}"></script>
    <!--弹窗js-->
    <script th:src="@{/assets/js/modal.js}"></script>
    <div class="colors"> <!-- To use theme colors with Javascript -->
        <div class="bg-primary"></div>
        <div class="bg-primary-bright"></div>
        <div class="bg-secondary"></div>
        <div class="bg-secondary-bright"></div>
        <div class="bg-info"></div>
        <div class="bg-info-bright"></div>
        <div class="bg-success"></div>
        <div class="bg-success-bright"></div>
        <div class="bg-danger"></div>
        <div class="bg-danger-bright"></div>
        <div class="bg-warning"></div>
        <div class="bg-warning-bright"></div>
    </div>
    <script th:inline="javascript">
        let boo = /*[[${#session.getAttribute('dark')!=null}]]*/ false;
        if (boo) {
            $('body').addClass('dark');
        }

        $('i.moon').on('click', function () {
            if ($('body').hasClass('dark')) {
                $('body').removeClass('dark');
                $.post("/toggle", function (result) {
                    console.log(result);
                });
            } else {
                $('body').addClass('dark');
                $.post("/toggle", {cls: "dark"}, function (result) {
                    console.log(result);
                });
            }
        });
    </script>
</div>
</body>
</html>